<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
<title>答题结果</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="/mp/css/base.css" media="all">
    <link rel="stylesheet" type="text/css" href="/mp/css/mm_style.css" media="all">
</head>
<body>
<div class="resultBox">
    <div class="bigCircle">
        <div class="scoreBox" id="scoreBox">
            <p class="score" id="score"></p>
            <p class="smallSize">答对题数/总题数</p>
        </div>
        <p class="examResult" id="examResult"></p>
    </div>
    <div class="tac examTime">
        <p class="" id="usedTime"></p>
    </div>
</div>
<div class="resultCard">
    <div class="mHeader mHeader01">
        <h4 class="">答题卡</h4>
    </div>
    <ul  class="timuBox timuBox01" id="everyQuestion">
    </ul>
</div>

<script type="text/javascript" src="/mp/js/mobile.js"></script>
<script type="text/javascript" src="/mp/js/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="/mp/js/common/common.js"></script>
<script>
    $(function(){
        var dataItem = JSON.parse(window.localStorage.getItem("specialAnswerItem"));
        var data = dataItem.answer;
        console.log(dataItem);
        var isPass = dataItem.isPass;
        var usedTime = dataItem.useTime;
        var score = 0;
        for(var i in data){
            if(data[i].isPass == 1){
                score++;
            }
        }
        var resultCount = data.length;
        if(isPass==1){//通过
            $("#examResult").text("通过考试");
        }else{
            $("#examResult").text("未通过考试");
            $(".resultBox").css('background-image','url("/mp/images/bg01grey.png")');
            $(".bigCircle").css('background-image','url("/mp/images/bg02grey.png")');
            $("#scoreBox").css('background-image','url("/mp/images/bg03grey.png")');
        }
        $("#usedTime").text("时间： "+usedTime+"");
        $("#score").html(score+"<span class='fsSmall26'>/"+resultCount+"</span>");

        $("body").on("click",".timuBox li",function () {
            var number = parseInt($(this).text());
            location.href = "/view/mp/special-result-details?number="+number;
        });
        for(var i=0;i<data.length;i++){
            var detailId = data[i].detailsId;
            var hisOption = data[i].hisOption;
            var questionAnswer =data[i].questionAnswer;
            var orderId = i+1;
            if(hisOption==""||hisOption==null){
                $("#everyQuestion").append("<li class='weidaTi iphoneModel'>"+orderId+"</li>");
            }else{
                if(hisOption==questionAnswer){
                    $("#everyQuestion").append("<li class='correctTi iphoneModel'>"+orderId+"</li>");
                }else{
                    $("#everyQuestion").append("<li class='wrongTi iphoneModel'>"+orderId+"</li>");
                }
            }
        }
    });
</script>
</body>
</html>